<template>
  <div>
    <div class="pdf-box">
      <pdf
        ref="pdf"
        :src="src"
        :page="currentPage"
        @page-loaded="currentPage = $event"
        @loaded="loadPdfHandle"
      ></pdf>
    </div>
    <!-- <van-pagination
      v-model="currentPage"
      :total-items="125"
      :show-page-size="3"
      :page-count="totalPage"
      force-ellipses
    /> -->
  </div>
</template>

<script>
import pdf from "vue-pdf";
var loadingTask = pdf.createLoadingTask(
  "./pdf/2020尚学堂前端课程大纲-第五版.pdf"
);
export default {
  name: "ContractInfo",
  components: {
    pdf,
  },
  data() {
    return {
      src: loadingTask,
      currentPage: 1,
      numPages: 1,
      totalPage:1
    };
  },
  methods: {
    loadPdfHandle() {
      // console.log('加载完成');
    },
  },
  mounted() {
    this.src.promise.then((pdf) => {
      this.totalPage = pdf.numPages;
    });
  },
};
</script>

<style scoped lang="less">
</style>